@import "common";
@import "Main";
@import "HkfsNewsCommon";
@import "HkfsCommonTabStyle";
.HkfsAbout{
  .HkfsAboutTab{
    .HkfsCommonTabStyle();
    .ReTab_Contents{
      margin-top: 50px;
    }

    .HkfsAboutBanner{
      width:100%;
      position:relative;
      height:400px;
      .HkfsAboutBannerImg{
        width:100%;
        height:400px;
        z-index: 1;
        position:absolute;
      }
      .HkfsAboutBannerContent{
        position:absolute;
        z-index: 2;
        width:100%;
        .HkfsAboutButton{
          color: #ffffff;
          border-color: #40a9dd;
          background-color: #40a9dd;
          width:290px;
          height:54px;
          font-size: 24px;
          margin-top: 20px;
        }
        div{
          text-align: center;
          font-size: 16px;
          color:#666666;
          height:40px;
          line-height: 40px;
        }
        .BannerTitle{
          font-size:30px;
          font-weight:bold;
          color:#000000;
          width: 100%;
          height: 80px;
          line-height: 80px;
          margin-top: 40px;
        }

      }
    }

    .NewsBack{
      a:hover { color:#40a9dd !important;}
      .CommonGreyBack();
      .News{
        .CommonWhite();
        .NewsContent{
          height:610px;
          padding:0 30px;
          .HkfsAboutNews{
            li{
              height:60px;
              line-height: 60px;
              border-bottom: dashed 1px #cccccc;
            }
          }
        }
      }
      .PagerDiv{
        margin-top: 50px;
        text-align: right;
        margin-right: 10px;
      }
    }

    .CallUsBack{
      .CommonGreyBack();
      .CallUs{
        .CommonWhite();
        .HkfsAboutOurAddress{
          margin-top: 30px;
          img{
            margin:auto;
            display: block;
          }
        }
        .HkfsAboutCompanyName, .HkfsAboutCompanyOther{
          margin-left: 40px;
        }
        .HkfsAboutCompanyName{
          color:#333333;
          font-size: 20px;
          height:60px;
          line-height: 60px;
          margin-top: 20px;
        }
        .HkfsAboutCompanyOther{
          font-size: 16px;
          color:#666666;
          height: 30px;
          line-height: 35px;
        }

      }
    }

    .HkfsAboutTitle{
      .HkfsBlueTitle();
    }

    .HkfsAboutUsBack{
      background-color: #f6f6f6;
      height:400px;
      .HkfsAboutUs{
        height:100%;
        width:@mainWidth;
        margin:auto;
        div{
          display:inline-block;
          height:100%;
        }
        .hkfsAboutImg{
          width:56.4%;
          img{
            width:100%;
            height:auto;
          }
        }
        .hkfsAboutArticle{
          width: 40%;
          padding: 60px 0 0 3%;
          vertical-align: top;
          line-height: 30px;
          color:#666666;
          .hkfsAboutTitle{
            font-size: 19px;
            font-weight: bold;
            line-height: 60px;
            color:black;
          }
        }
      }
    }

    .HkfsAboutWant{
      width:@mainWidth;
      margin:20px auto auto auto;
      .WantLeftNavigation{
        .TitleLeft{
          color:#40a9dd;
        }
        .TitleRight{
          color:#666666;
        }
        .ReLeftNavigationContent{
          padding:0;
        }
        .active{
          padding:20px 0;
        }
      }
      .WantBubble{
        border-color: #f6f6f6;
        background-color:#f6f6f6;
        .Top{
          border-color: transparent transparent #f6f6f6;
        }
        .Bot{
          border-color: transparent transparent #f6f6f6;
        }
        .Content{
          padding:0 2%;
          text-align: left;
        }
      }
    }
    .HkfsAboutTeam{
      width:@mainWidth;
      margin:auto;
      .HkfsAboutTeamMembers{
        margin: 40px auto;
        width: 90%;
        &>div {
          display: inline-block;
        }
      }
  /*    &>div{
        &:first-child {
          margin-top: 50px;
        }
      }*/

    }

    .HkfsAboutEgoBackGround{
      background-image: url('../images/pc/company_img_Guangzhou.png');
      background-position: bottom;
      background-repeat: no-repeat;
      height:400px;
      .HkfsAboutEgo{
        width: @mainWidth;
        margin: auto;
        height:100%;

        &>div{
          display:inline-block;
          vertical-align: middle;
        }
        .EgoSlider{
          width:70%;
          .EgoItem{
            text-align: center;
            &>div{
              text-align: center;
              width: 100%;
              white-space: normal;
            }
          }
        }
        .EgoImage{
          height:100%;
          position:relative;
          width:30%;
          img {
            position: absolute;
            .absoluteCenter(150px);
          }
        }
      }
    }

    .HkfsAboutMap{
      position:relative;
      width:@mainWidth;
      margin:auto;
      .MapDescription{
        width:210px;
        position:absolute;
        bottom:75px;
        right:10px;
        border:dashed 1px  #333333;
        color:#666666;
        padding:10px;
        font-size: 14px;
      }
    }

    .HkfsAboutCompanyBackGround {
      background-image: url('../images/pc/conpany_gray_bg.jpg');
      .HkfsAboutCompany {
        width: @mainWidth;
        margin: auto;
        padding: 65px 0;
        .HkfsAboutCompanyTitle {
          width: 40%;
          img {
            position: absolute;
            .absoluteCenter(155px);
          }
        }
        .HkfsAboutMessage {
          width: 60%;
          height: auto;
          span{
            font-size: 18px;
            line-height: 30px;
            color: #666666;
          }
          p{
            text-indent: 2em;
            padding-bottom: 1em;
            color: #666666;
          }
        }
        & > div {
          display: inline-block;
          height: 100%;
          position: relative;
          vertical-align: middle;
        }
      }
    }
  }
  .HkfsAboutProcess{
    padding: 100px 0 40px 0;
    position:relative;
    background: url('../images/pc/conpany_gray_bg.jpg');

    .HkfsProcessItemTime{
      color:#333333;
      font-size: 28px;
    }

    .HkfsProcessItemContent{
      color:#666666;
      font-size: 16px;
      margin-top: 10px;
    }
    .HkfsAboutProcessTitle{
      text-align: center;
      position:absolute;
      top:30px;
      font-size: 24px;
      color:#f7931e;
      width:100%;
    }
    .HkfsAboutCenterCircle{
      position:absolute;
      top: 70px;
      height:46px;
      width:46px;
      background-color: rgba(247,147,30,0.3);
      .border-radius(23px);
      margin: auto;
      left: 0;
      right:0;
      .SmallCircle{
        height:26px;
        width:26px;
        background-color: rgb(247,147,30);
        .border-radius(13px);
        .absoluteCenter(26px)
      }
    }
    .HkfsAboutCenterLine{
      position:absolute;;
      height:85%;
      width:1px;
      border-right: dashed 2px rgb(247,147,30);
      margin:auto;
      left: 0;
      right:0;
    }

  }
}
